<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<header id="header">
    <div class="header-body">
        <a href="/" class="logo">猫眼电影</a>
        <div class="city">
            [[${session.city.name}]]
            <span class="caret"></span>
        </div>
        <div class="city-list">
            <div class="now-city">
                定位城市: [[${session.city.name}]]
            </div>
            <div class="citys">
                <span class="icon"></span> 正在开发
            </div>
        </div>
        <!--<span sec:authentication="principal.users.headImgUrl"></span>-->
        <!--<span th:text="${session.SPRING_SECURITY_CONTEXT.authentication.principal.users.headImgUrl}"></span>-->
        <div class="nav">
            <ul class="nav-list">
                <li class="nav-model"><a th:href="@{/}">首页</a></li>
                <li class="nav-model"><a th:href="@{/movie/movies?}">电影</a></li>
                <li class="nav-model"><a th:href="@{/movie/theatre/cinemas}">影院</a></li>
                <li class="nav-model">演出</li>
                <li class="nav-model">榜单</li>
                <li class="nav-model">热点</li>
                <li class="nav-model">商城</li>
            </ul>
        </div>
        <div class="app-download">
            <a href="#">
                <span class="phone"></span> APP下载
                <span class="caret"></span>
                <div class="appcode">
                    <p class="down-tip">扫码下载APP</p>
                    <p class="down-text">选座更优惠</p>
                </div>
            </a>
        </div>
        <div class="search">
            <div type="text" class="searchinput">
                <input type="text" class="input" placeholder="找影视剧、影人、影院">
                <input class="submit" type="submit" value="">
            </div>
        </div>
        <div class="userimg" sec:authorize="!isAuthenticated()">
            <img id="masterHeapImg" src="https://catdog-movie.oss-cn-beijing.aliyuncs.com/heapPortrait/default.png"
                 style="height: 40px;width: 40px">
            <span class="caret"></span>
        </div>
        <div class="userimg" sec:authorize="isAuthenticated()">
            <img id="masterHeapImg"
                 th:src="${session.SPRING_SECURITY_CONTEXT.authentication.principal.users.headImgUrl}"
                 style="height: 40x;width: 40px">
            <span class="caret"></span>
        </div>

        <div class="userlogin" style="height: 100px;color: red">
            <!--未登录-->
            <div sec:authorize="!isAuthenticated()">
                <a th:href="@{/login.html}">登录</a><br>
            </div>
            <!--以登录-->
            <div sec:authorize="isAuthenticated()">
                <a th:href="@{/movie/order/personalOrder}">个人中心</a><br>
                <!--<a href="personal.html">修改头像</a><br>-->
                <a href="/logout">退出</a><br>
            </div>
            <script>
                $(function () {
                    var title = document.title
                    $(".nav-list li").each(function (index, element) {
                        // alert($(this).text())
                        if (title == $(this).text()) {
                            // alert("进来了")
                            $(this).addClass("active")
                            $(this).children("a").attr("style", "color: white")
                        }
                    })
                })
            </script>
</header>


</body>
</html>